<div class="che-select">
  <!-- Mobile version -->
  <md-input-container hide-gt-md class="md-input-has-value">
    <label>{{labelName}}</label>
    <select class="che-select-container"
            ng-model="valueModel"
            name="{{selectName}}">
      <option value="">{{placeHolder}}</option>
    </select>
  </md-input-container>

  <!-- Desktop version -->
  <div class="che-select-desktop" hide-sm hide-md layout="column" flex>
    <div layout="row" flex layout-align="space-around start">
      <label flex="15">{{labelName}}: </label>

      <div layout="column" class="che-select-container" flex="85">
        <select ng-model="valueModel"
                name="{{selectName}}"
                ng-mousedown="showOptions()"
                ng-change="hideOptions()"
                ng-blur="hideOptions()">
          <option value="">{{placeHolder}}</option>
        </select>
      </div>
    </div>
  </div>
</div>
